import React from 'react'
import { Modal, Form, Input, message } from 'antd'
import { editOrder } from '../../../request/order'

function EditOrder(props) {
  const { visible, close, order } = props
  const { getFieldDecorator, validateFields } = props.form
  const { Item } = Form

  const onSubmit = () => {
    validateFields(async(err, values) => {
      if (err) {
        return false
      }
      const res = await editOrder({ ...values, order_no: order.order_no })
      if (res.code) {
        message.error(res.message)
        return false
      }
      message.success('修改成功')
      close()
    })
  }

  return (
    <div className="create-customer">
      <Modal
        visible={visible}
        onCancel={close}
        onOk={onSubmit}
        okText="确定"
        cancelText="取消"
        maskClosable={false}
        title="编辑订单"
        width="500px"
        closable={false}
      >
        <Form labelCol={{ sm: { span: 6 } }} wrapperCol={{ sm: { span: 18 } }}>
          <Item label="姓名">
            {getFieldDecorator('true_name', {
              initialValue: order.true_name,
              rules: [
                { required: true, message: '姓名不能为空' }
              ]
            })(
              <Input placeholder="请输入姓名"/>
            )}
          </Item>
          <Item label="电话">
            {getFieldDecorator('phone', {
              initialValue: order.phone,
              rules: [
                { required: true, message: '电话不能为空' }
              ]
            })(
              <Input placeholder="请输入电话"/>
            )}
          </Item>
          <Item label="身份证号">
            {getFieldDecorator('idcard', {
              initialValue: order.idcard,
              rules: [
                { required: true, message: '身份证号不能为空' }
              ]
            })(
              <Input placeholder="请输入身份证号"/>
            )}
          </Item>
          <Item label="地址">
            {getFieldDecorator('address', {
              initialValue: order.address,
              rules: [
                { required: true, message: '地址不能为空' }
              ]
            })(
              <Input placeholder="请输入地址"/>
            )}
          </Item>
          <Item label="快递公司">
            {getFieldDecorator('express', {
              initialValue: order.express
            })(
              <Input placeholder="请输入快递公司"/>
            )}
          </Item>
          <Item label="快递单号">
            {getFieldDecorator('express_no', {
              initialValue: order.express_no
            })(
              <Input placeholder="请输入快递单号"/>
            )}
          </Item>
          <Item label="ICCID">
            {getFieldDecorator('ICCID', {
              initialValue: order.ICCID
            })(
              <Input placeholder="请输入ICCID"/>
            )}
          </Item>
          <Item label="新号码">
            {getFieldDecorator('new_phone', {
              initialValue: order.new_phone
            })(
              <Input placeholder="请输入新号码"/>
            )}
          </Item>
          <Item label="订单备注">
            {getFieldDecorator('remark', {
              initialValue: order.remark
            })(
              <Input.TextArea placeholder="填写订单备注"/>
            )}
          </Item>
        </Form>
      </Modal>
    </div>
  )
}

export default Form.create()(EditOrder)
